// components/CustomHeader.tsx

import React, { Fragment } from 'react';
import Link from 'next/link';
import { BsChevronLeft } from "react-icons/bs";
import { Button } from "@material-tailwind/react";
import { useRouter } from 'next/router';
interface CustomHeaderProps {
    title: string;
    isHome?: boolean
}

const CustomHeader: React.FC<CustomHeaderProps> = ({ title, isHome = false }) => {

    const router = useRouter();


    const goBack = () => {
        // 检查 sessionStorage 是否有访问标记
        if (!sessionStorage.getItem('hasVisited')) {
            // 没有标记，说明用户可能直接打开了链接，没有历史记录
            // 这里设置跳转到主页
            router.push('/');
        } else {
            // 如果有访问标记，尝试使用浏览器的历史回退功能
            if (window.history.length > 1) {
                router.back();
            } else {
                // 浏览器历史记录不足以回退，跳转到主页
                router.push('/');
            }
        }
    }
    return (
        <Fragment>
            <div className="flex bg-mainBgColor justify-center h-12 px-2 border-b shadow-xs fixed z-50 top-0 left-0 right-0">
                <div className="w-1/6 flex items-center">
                    {!isHome && <div onClick={goBack}>
                        <Button placeholder={'button'} variant="text" ripple={false} className="rounded-full flex items-center p-2 text-xl" onPointerEnterCapture={undefined} onPointerLeaveCapture={undefined}>
                            <BsChevronLeft className='text-xl' />
                        </Button>
                    </div>}
                </div>
                <div className="w-4/6 text-lg font-bold flex justify-center items-center">{title}</div>
                <div className="w-1/6"></div>
            </div>
            <div className='h-12 w-full'></div>
        </Fragment>

    );
};

export default CustomHeader;
